<template>
	<view>
		<view class="page">
		    <comp-common v-bind="{data:data}" @getUserInfo="getUserInfo" @myLogin="myLogin" @getPhoneNumber="getPhoneNumber" @hideGetCoupon="hideGetCoupon" @closeCouponBox="closeCouponBox" @navigatorClick="navigatorClick"></comp-common>
			<comp-header v-bind="{data:data}" @relevanceError="relevanceError" @relevanceSuccess="relevanceSuccess"></comp-header>
		    <view class="body after-navber">
		        <view class="no-content" v-if="!data.list||data.list.length==0">暂无中奖记录</view>
		        <block v-for="(item) in data.list" :key="item">
		            <view class="prize-top">
		                <view class="prize-cen">
		                    <view class="prize-goods">{{item['name']}}</view>
		                    <view class="prize-time">{{item['create_time']}}</view>
		                </view>
		                <view @click="submit" class="prize-start" :data-attr="item.attr" :data-gift="item.gift_id" :data-id="item.id" v-if="item['status']==1&&item['type']==4">立即兑换</view>
		                <view class="prize-end" v-if="item['status']==2&&item['type']==4">已兑换</view>
		                <view class="prize-end" v-if="item['status']==2&&item['type']!=4">已发放</view>
		            </view>
		            <view class="prize-line"></view>
		        </block>
		    </view>
		    
		</view>
		
	</view>
</template>

<script>var myVue = {};
	export default {
		data() {
			return {
				data:{
					 args: !1,
					page: 1
				}
			};
		},
		 onLoad: function(t) {myVue = this;
		    myVue.getApp.page.onLoad(this, t);
		},
		onShow: function() {
			var a = this;
		    a.getApp.page.onShow(this);
		    a.getApp.core.showLoading({
		        title: "加载中"
		    }), a.getApp.request({
		        url: a.getApp.api.scratch.prize,
		        data: {
		            page: 1
		        },
		        success: function(t) {
		            0 == t.code && a.setData({
		                list: t.data
		            });
		        },
		        complete: function(t) {
		            a.getApp.core.hideLoading();
		        }
		    });
		},
		methods:{
			onReachBottom: function() {
				var a = this;
			    a.getApp.page.onReachBottom(this);
			    
			    if (!a.data.args) {
			        var e = a.data.page + 1;
			        a.getApp.request({
			            url: a.getApp.api.scratch.prize,
			            data: {
			                page: e
			            },
			            success: function(t) {
			                0 == t.code ? a.setData({
			                    list: a.data.list.concat(t.data),
			                    page: e
			                }) : a.data.args = !0;
			            }
			        });
			    }
			},
			submit: function(t) {
				var that=this;
			    var a = t.currentTarget.dataset.gift, e = JSON.parse(t.currentTarget.dataset.attr), o = t.currentTarget.dataset.id;
			    that.getApp.core.navigateTo({
			        url: "/pages/order-submit/order-submit?scratch_id=" + o + "&goods_info=" + JSON.stringify({
			            goods_id: a,
			            attr: e,
			            num: 1
			        })
			    });
			}
		}
	}
</script>

<style scoped>
.prize-start {
    float: right;
    border-radius: 28upx;
    color: #ff4544;
    font-size: 12pt;
    border: 1px solid #ff4544;
    text-align: center;
    margin-top: 50upx;
    line-height: 56upx;
    width: 200upx;
    margin-right: 24upx;
}

.prize-end {
    float: right;
    background: #cdcdcd;
    border-radius: 28upx;
    color: #ffffff;
    font-size: 12pt;
    text-align: center;
    margin-top: 50upx;
    line-height: 56upx;
    width: 200upx;
    margin-right: 24upx;
}

.prize-line {
    border: 1upx solid #e2e2e2;
}

.prize-time {
    font-size: 11pt;
    color: #666666;
}

.prize-goods {
    padding: 20upx 0 22upx 0;
    font-size: 12pt;
    color: #353535;
    max-width: 480upx;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.prize-top {
    padding-left: 24upx;
    margin-bottom: 20upx;
}

.prize-cen {
    display: inline-block;
}

.no-content {
    color: #888;
    padding: 100upx 0 0 0;
    text-align: center;
}
</style>
